{#----------------------------------------------------------------------------#}
{# Кнопка вызова модального выплывающего окна для подтверждения
пользовательского действия.

  Аргументы
  ----------
  caption : string
    Текст и прочие теги на кнопке.

  title : string
    Тект всплывающей подсказки на кнопке.

  class : string
    Класс кнопки.

  target : string
    Идентификатор целевого модяльного окна, которое должно всплывать при
    её нажатии.
#}
{% macro BUTTON(
    caption,
    title="",
    class="btn btn-primary",
    target="the_modal_window")
-%}
  <button
      type="button"
      class="{{ class }}"
      data-bs-toggle="modal"
      data-bs-target="#{{ target }}"
      title="{{ title }}">
    {{ caption }}
  </button>
{%- endmacro %}

{#----------------------------------------------------------------------------#}
{# Выплывающее модальное окно для подтверждения пользовательского действия.

  Аргументы
  ----------
  title : string
    Заголовок модального окна.

  text : string
    Основной контент модального окна.

  action_button_href : string
    Ссылка на главной кнопке окна.

  action_button_text : string
    Текст и теги главной кнопки окна.

  window_id : string
    Идентификатор модального окна, используется в макросе BUTTON
    аргумент target.
#}
{% macro MODAL_WINDOW(
    title,
    text,
    action_button_href,
    action_button_text="Да",
    window_id="the_modal_window")
-%}
  <div
      class="modal fade"
      id="{{ window_id }}"
      data-bs-backdrop="static"
      data-bs-keyboard="false"
      tabindex="-1"
      aria-labelledby="{{ window_id }}_title"
      aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered text-start">
      <div class="modal-content">

        {# Заголовок #}
          <div class="modal-header">
            <h5 class="modal-title"
                id="{{ window_id }}_title">
              {{ title }}
            </h5>
            <button
                type="button"
                class="btn-close"
                data-bs-dismiss="modal"
                aria-label="Close">
            </button>
          </div>
        {# /Заголовок #}

        {# Тело #}
          <div class="modal-body">
            {{ text }}
          </div>
        {# /Тело #}

        {# Элементы управления #}
          <div class="modal-footer">
            <a  href="{{ action_button_href }}"
                class="btn btn-primary">
              {{ action_button_text }}
            </a>
            <button
                type="button"
                class="btn btn-secondary"
                data-bs-dismiss="modal">
              Отмена
            </button>
          </div>
        {# /Элементы управления #}

      </div>
    </div>
  </div>
{%- endmacro %}
